From f287e8225892266acf162ba94ee31ce623e06890 Mon Sep 17 00:00:00 2001 From: Factiven Date: Fri, 28 Apr 2023 13:36:29 +0700 Subject: Editor List v0.2 --- pages/anime/[...id].js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'pages/anime/[...id].js') diff --git a/pages/anime/[...id].js b/pages/anime/[...id].js index f26c70d..99973d4 100644 --- a/pages/anime/[...id].js +++ b/pages/anime/[...id].js @@ -368,7 +368,7 @@ export default function Info() { )} - {session && info && progress && ( + {session && loading && ( Date: Fri, 28 Apr 2023 16:50:49 +0700 Subject: Editor List v0.3 --- pages/anime/[...id].js | 122 +++++++++++++++++++++++++++---------------------- 1 file changed, 68 insertions(+), 54 deletions(-) (limited to 'pages/anime/[...id].js') diff --git a/pages/anime/[...id].js b/pages/anime/[...id].js index 99973d4..9ad58a2 100644 --- a/pages/anime/[...id].js +++ b/pages/anime/[...id].js @@ -168,11 +168,14 @@ export default function Info() { const [aniStatus, setAniStatus] = useState(statuses); const [aniProgress, setAniProgress] = useState(0); + const [epiStatus, setEpiStatus] = useState("ok"); const rec = info?.recommendations?.nodes.map( (data) => data.mediaRecommendation ); + // const [log, setLog] = useState(null); + useEffect(() => { const defaultState = { data: null, @@ -181,6 +184,8 @@ export default function Info() { loading: true, statuses: null, progress: null, + stall: false, + EpiStatus: "ok", }; // Reset all state variables to their default values @@ -224,6 +229,7 @@ export default function Info() { const data = await res.json(); const infos = await info.json(); setInfo(infos.data.Media); + // setLog(data); const textColor = setTxtColor(infos.data.Media.coverImage?.color); @@ -232,12 +238,17 @@ export default function Info() { `https://api.consumet.org/meta/anilist/info/${id[0]}?provider=9anime` ); const datas = await res.json(); + if (res.status === 500) { + setEpisode(null); + setEpiStatus("error"); + } else { + setEpisode(datas.episodes); + } setColor({ backgroundColor: `${data?.color || "#ffff"}`, color: textColor, }); setStall(true); - setEpisode(datas.episodes); } else { setEpisode(data.episodes); } @@ -280,8 +291,8 @@ export default function Info() { setStatuses("Watching"); setAniStatus("Watching"); } else if (gut.status === "PLANNING") { - setStatuses("Planned to watch"); - setAniStatus("Planned to watch"); + setStatuses("Plan to watch"); + setAniStatus("Plan to watch"); } else if (gut.status === "COMPLETED") { setStatuses("Completed"); setAniStatus("Completed"); @@ -435,12 +446,13 @@ export default function Info() { {info && (
-
handleOpen()} > {statuses ? statuses : "Add to List"} -
+
@@ -477,7 +489,7 @@ export default function Info() {
{info ? ( <> -
+
poster anime + ) : ( @@ -554,7 +573,6 @@ export default function Info() { ) : ( )} - {/*

{data.description}

*/}
@@ -670,58 +688,54 @@ export default function Info() {
)} - {statuses && ( - <> -
- {statuses} - - status - -
- - )}
{loading ? ( data && (
- {episode?.length !== 0 ? ( - episode?.map((epi, index) => { - return ( -
- { + return ( +
-

Episode {epi.number}

- {epi.title && ( -

- "{epi.title}" -

+ +

Episode {epi.number}

+ {epi.title && ( +

+ "{epi.title}" +

+ )} + + {index !== episode?.length - 1 && ( + )} - - {index !== episode?.length - 1 && ( - - )} -
- ); - }) +
+ ); + }) + ) : ( +

No Episodes Available

+ ) ) : ( -

No Episodes Available

+

+ Something went wrong, can't retrieve any episodes :/ +

)}
) -- cgit v1.2.3 From b546c63c38c608cfbbf68ddd1aa4d1327489d91c Mon Sep 17 00:00:00 2001 From: Factiven Date: Fri, 28 Apr 2023 17:31:15 +0700 Subject: Editor List v0.4 --- pages/anime/[...id].js | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) (limited to 'pages/anime/[...id].js') diff --git a/pages/anime/[...id].js b/pages/anime/[...id].js index 9ad58a2..5e66133 100644 --- a/pages/anime/[...id].js +++ b/pages/anime/[...id].js @@ -451,7 +451,11 @@ export default function Info() { className="bg-action px-10 rounded-sm font-karla font-bold" onClick={() => handleOpen()} > - {statuses ? statuses : "Add to List"} + {loading + ? statuses + ? statuses + : "Add to List" + : "Loading..."}
@@ -504,7 +508,11 @@ export default function Info() { className="bg-action flex-center z-20 h-[20px] w-[180px] absolute bottom-0 rounded-sm font-karla font-bold" onClick={() => handleOpen()} > - {statuses ? statuses : "Add to List"} + {loading + ? statuses + ? statuses + : "Add to List" + : "Loading..."} ) : ( -- cgit v1.2.3 From ad5721b03983e2db4c69738b82d2a871ebbb1065 Mon Sep 17 00:00:00 2001 From: Factiven Date: Fri, 28 Apr 2023 17:51:36 +0700 Subject: Editor List v0.5 --- pages/anime/[...id].js | 35 ++++++++++------------------------- 1 file changed, 10 insertions(+), 25 deletions(-) (limited to 'pages/anime/[...id].js') diff --git a/pages/anime/[...id].js b/pages/anime/[...id].js index 5e66133..ef54b1b 100644 --- a/pages/anime/[...id].js +++ b/pages/anime/[...id].js @@ -166,7 +166,6 @@ export default function Info() { const [time, setTime] = useState(0); const { id } = useRouter().query; - const [aniStatus, setAniStatus] = useState(statuses); const [aniProgress, setAniProgress] = useState(0); const [epiStatus, setEpiStatus] = useState("ok"); @@ -288,23 +287,17 @@ export default function Info() { setProgress(gut?.progress); setAniProgress(parseInt(gut?.progress)); if (gut.status === "CURRENT") { - setStatuses("Watching"); - setAniStatus("Watching"); + setStatuses({ name: "Watching", value: "CURRENT" }); } else if (gut.status === "PLANNING") { - setStatuses("Plan to watch"); - setAniStatus("Plan to watch"); + setStatuses({ name: "Plan to watch", value: "PLANNING" }); } else if (gut.status === "COMPLETED") { - setStatuses("Completed"); - setAniStatus("Completed"); + setStatuses({ name: "Completed", value: "COMPLETED" }); } else if (gut.status === "DROPPED") { - setStatuses("Dropped"); - setAniStatus("Dropped"); + setStatuses({ name: "Dropped", value: "DROPPED" }); } else if (gut.status === "PAUSED") { - setStatuses("Paused"); - setAniStatus("Paused"); + setStatuses({ name: "Paused", value: "PAUSED" }); } else if (gut.status === "REPEATING") { - setStatuses("Rewatching"); - setAniStatus("Rewatching"); + setStatuses({ name: "Rewatching", value: "REPEATING" }); } } } @@ -338,16 +331,6 @@ export default function Info() { document.body.style.overflow = "auto"; } - function handleSubmit(e) { - e.preventDefault(); - const formData = { status: aniStatus, progress: aniProgress }; - console.log(formData); - } - - function handleProgress(e) { - setAniProgress(e.target.value); - } - // console.log(progress); return ( @@ -402,6 +385,7 @@ export default function Info() { info?.coverImage?.extraLarge || info?.coverImage.large } + priority={true} alt="banner anime" height={1000} width={1000} @@ -453,7 +437,7 @@ export default function Info() { > {loading ? statuses - ? statuses + ? statuses.name : "Add to List" : "Loading..."} @@ -498,6 +482,7 @@ export default function Info() { src={ info.coverImage.extraLarge || info.coverImage.large } + priority={true} alt="poster anime" height={700} width={700} @@ -510,7 +495,7 @@ export default function Info() { > {loading ? statuses - ? statuses + ? statuses.name : "Add to List" : "Loading..."} -- cgit v1.2.3 From f5086c7c394a9910a31ec80df143f5655cfde501 Mon Sep 17 00:00:00 2001 From: Factiven Date: Sat, 29 Apr 2023 10:41:23 +0700 Subject: Bug Fixes > Fixed loop refresh when failed fetching episode data --- pages/anime/[...id].js | 56 +++++++++++++++++++++++++++++++++++--------------- 1 file changed, 39 insertions(+), 17 deletions(-) (limited to 'pages/anime/[...id].js') diff --git a/pages/anime/[...id].js b/pages/anime/[...id].js index ef54b1b..63849bc 100644 --- a/pages/anime/[...id].js +++ b/pages/anime/[...id].js @@ -140,15 +140,6 @@ const infoQuery = `query ($id: Int) { } }`; -const stats = [ - "Watching", - "Plan to Watch", - "Completed", - "Dropped", - "Paused", - "Rewatching", -]; - export default function Info() { const { data: session, status } = useSession(); const [data, setData] = useState(null); @@ -166,8 +157,8 @@ export default function Info() { const [time, setTime] = useState(0); const { id } = useRouter().query; - const [aniProgress, setAniProgress] = useState(0); const [epiStatus, setEpiStatus] = useState("ok"); + const [error, setError] = useState(null); const rec = info?.recommendations?.nodes.map( (data) => data.mediaRecommendation @@ -185,6 +176,7 @@ export default function Info() { progress: null, stall: false, EpiStatus: "ok", + error: null, }; // Reset all state variables to their default values @@ -227,12 +219,20 @@ export default function Info() { ]); const data = await res.json(); const infos = await info.json(); + + if (res.status === 500) { + setEpisode(null); + setEpiStatus("error"); + setError(data.message); + } else if (res.status === 404) { + window.location.href("/404"); + } setInfo(infos.data.Media); // setLog(data); const textColor = setTxtColor(infos.data.Media.coverImage?.color); - if (!data || data.episodes.length === 0) { + if (!data || data?.episodes?.length === 0) { const res = await fetch( `https://api.consumet.org/meta/anilist/info/${id[0]}?provider=9anime` ); @@ -240,6 +240,7 @@ export default function Info() { if (res.status === 500) { setEpisode(null); setEpiStatus("error"); + setError(datas.message); } else { setEpisode(datas.episodes); } @@ -285,7 +286,6 @@ export default function Info() { if (gut) { setProgress(gut?.progress); - setAniProgress(parseInt(gut?.progress)); if (gut.status === "CURRENT") { setStatuses({ name: "Watching", value: "CURRENT" }); } else if (gut.status === "PLANNING") { @@ -331,8 +331,6 @@ export default function Info() { document.body.style.overflow = "auto"; } - // console.log(progress); - return ( <> @@ -726,9 +724,19 @@ export default function Info() {

No Episodes Available

) ) : ( -

- Something went wrong, can't retrieve any episodes :/ -

+ //

+ // Something went wrong, can't retrieve any episodes :/ + //

+
+

{epiStatus} while retrieving data

+ 
+                            {error}
+
+
)}
) @@ -799,3 +807,17 @@ function setTxtColor(hexColor) { const brightness = getBrightness(hexColor); return brightness < 150 ? "#fff" : "#000"; } + +const getLanguageClassName = (language) => { + switch (language) { + case "javascript": + return "language-javascript"; + case "html": + return "language-html"; + case "bash": + return "language-bash"; + // add more languages here as needed + default: + return ""; + } +}; -- cgit v1.2.3 From e6346b1d7d788754d0c2d11fc18724627ec5bf15 Mon Sep 17 00:00:00 2001 From: Factiven Date: Sat, 29 Apr 2023 14:30:08 +0700 Subject: Editor List v0.6 --- pages/anime/[...id].js | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) (limited to 'pages/anime/[...id].js') diff --git a/pages/anime/[...id].js b/pages/anime/[...id].js index 63849bc..3b1cf91 100644 --- a/pages/anime/[...id].js +++ b/pages/anime/[...id].js @@ -278,11 +278,9 @@ export default function Info() { const gat = prog.lists.map((item) => item.entries); const git = gat.map((item) => - item.find((item) => item.media.id === parseInt(data?.id)) - ); - const gut = git?.find( - (item) => item?.media.id === parseInt(data?.id) + item.find((item) => item.mediaId === parseInt(id[0])) ); + const gut = git?.find((item) => item?.mediaId === parseInt(id[0])); if (gut) { setProgress(gut?.progress); @@ -367,6 +365,7 @@ export default function Info() { stats={statuses} prg={progress} max={info?.episodes} + image={info} /> )} -- cgit v1.2.3 From a22aa58746cc852331d48e1d9d3c00f5e09564a1 Mon Sep 17 00:00:00 2001 From: Factiven Date: Sat, 29 Apr 2023 17:42:24 +0700 Subject: Editor List v0.7 --- pages/anime/[...id].js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'pages/anime/[...id].js') diff --git a/pages/anime/[...id].js b/pages/anime/[...id].js index 3b1cf91..712197e 100644 --- a/pages/anime/[...id].js +++ b/pages/anime/[...id].js @@ -339,14 +339,14 @@ export default function Info() { handleClose()}> -
+
{!session && (

Edit your list

)} - {session && loading && ( + {session && loading && info && ( {info ? (
-
- {info?.episodes} Episodes -
-
- {info?.startDate?.year} -
-
- {info?.averageScore}% -
-
- {info?.type} -
-
- {info?.status} -
+ {info?.episodes && ( +
+ {info?.episodes} Episodes +
+ )} + {info?.startDate?.year && ( +
+ {info?.startDate?.year} +
+ )} + {info?.averageScore && ( +
+ {info?.averageScore}% +
+ )} + {info?.type && ( +
+ {info?.type} +
+ )} + {info?.status && ( +
+ {info?.status} +
+ )}
- {rec && ( + {info && rec?.length !== 0 && (